<template>
  <view class="take">
    <!-- 无订单 -->
    <view class="notakebox">
      <view class="notake">
        <image class="noimg" src="/static/take/tea.png" mode="widthFix" />
        <view class="titone">您还没有点单</view>
        <view class="tittwo">快去犒劳一下自己吧~</view>
        <button class="nobut">去点餐</button>
        <view class="titthree">查看历史订单</view>
      </view>
    </view>
    <!-- 无订单 -->
    <!-- 有订单 -->
    <view class="oktake" v-show="false">
      123
    </view>
    <!-- 有订单 -->
  </view>
</template>

<script>
export default {
  data() {
    return {};
  },
};
</script>

<style lang="scss">
.take {
  width: 100%;
  height: 100vh;
  padding-bottom: 50rpx;
  box-sizing: border-box;
  background-color: #f0f8fa;
}
.notakebox {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.notake{
  width: 100%;
  text-align: center;
  .noimg{
    width: 44%;
    margin-bottom: 50rpx;
  }
  .titone{
    color: #969697;
    margin-bottom: 16rpx;
  }
  .tittwo{
    color: #969697;
    margin-bottom: 50rpx;
  }
  .nobut{
    width: 60%;
    height: 100rpx;
    background-color: #ADB838;
    border-radius: 50rpx;
    color: #fff;
    font-size: 36rpx;
    margin-bottom: 50rpx;
  }
  .titthree{
    color: #B0BC47;
  }
}
</style>
